<template>
  <section class="page strategy-config">
    <data-form :model="model" :page="pageService" @onSearch="refreshData">
      <template slot="inputs">
        <el-form-item label="策略名称" prop="name">
          <el-input v-model="model.name"></el-input>
        </el-form-item>
        <el-form-item label="策略状态" prop="strategyStatus">
          <el-select clearable placeholder="请选择" v-model="model.strategyStatus">
            <el-option :key="code" :label="name" :value="code" v-for="{ code, name } in $dict.getDictData('StrategyStatus')"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="执行频次" prop="executionFrequency">
          <el-select clearable placeholder="请选择" v-model="model.executionFrequency">
            <el-option :key="code" :label="name" :value="code" v-for="{ code, name } in $dict.getDictData('ExecutionFrequency')"></el-option>
          </el-select>
        </el-form-item>
      </template>
    </data-form>
    <data-box :data="dataSet" :page="pageService" @onPageChange="refreshData">
      <template slot="buttons">
        <el-button @click="addClick" v-auth="28">新增策略</el-button>
      </template>
      <template slot="columns">
        <el-table-column :min-width="$helper.getColumnWidth(10)" label="操作">
          <template slot-scope="scope">
            <el-button @click="modifyClick(scope)" size="small" type="text" v-auth="260" v-if="scope.row.strategyStatus === 'READY' || scope.row.strategyStatus === 'COMPLETED'">编辑</el-button>
            <el-button @click="viewConfig(scope)" size="small" type="text" v-auth="260" v-else>查看</el-button>
            <el-button @click="executionRecordClick(scope)" size="small" type="text" v-auth="261">执行记录</el-button>
            <el-button @click="deletedClick(scope)" size="small" type="text" v-auth="262" v-if="scope.row.strategyStatus==='COMPLETED'">删除</el-button>
          </template>
        </el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="策略名称" prop="name"></el-table-column>
        <el-table-column :formatter="row => $filter.dictConvert(row.strategyStatus,'StrategyStatus')" :min-width="$helper.getColumnWidth(4)" label="策略状态" prop="strategyStatus"></el-table-column>
        <el-table-column :formatter="row => $filter.dictConvert(row.executionFrequency,'ExecutionFrequency')" :min-width="$helper.getColumnWidth(4)" label="执行频次" prop="executionFrequency"></el-table-column>
        <el-table-column :formatter="row => $filter.dictConvert(row.distributeType,'DistributeType')" :min-width="$helper.getColumnWidth(4)" label="案件类型" prop="distributeType"></el-table-column>
        <el-table-column :formatter="row => $filter.dateTimeFormat(row.startDate)" :min-width="$helper.getColumnWidth(6)" label="开始时间" prop="startDate"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="创建人" prop="operatorRealName"></el-table-column>
        <el-table-column :formatter="row => $filter.dateTimeFormat(row.createTime)" :min-width="$helper.getColumnWidth(6)" label="创建时间" prop="createTime"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="编辑人" prop="modifyOperatorRealName"></el-table-column>
        <el-table-column :formatter="row => $filter.dateTimeFormat(row.modifyDatetime)" :min-width="$helper.getColumnWidth(6)" label="编辑时间" prop="modifyDatetime"></el-table-column>
        <el-table-column :formatter="row => $filter.dateTimeFormat(row.latelyDatetime)" :min-width="$helper.getColumnWidth(6)" label="最近一次运行时间" prop="latelyDatetime"></el-table-column>
        <el-table-column :formatter="row => $filter.dateTimeFormat(row.afterDate)" :min-width="$helper.getColumnWidth(6)" label="下次运行时间" prop="latelyDatetime"></el-table-column>
      </template>
    </data-box>

    <el-dialog :center="true" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false" :title="dialogTitle" :visible.sync="dialog.config" @close="$refs['modify-config'].initData()" @opened="$refs['modify-config'].refresh()" width="1050px">
      <modify-config :disabledData="disabledData" :show="show" :strategyId="id" @close="dialog.config = false" @success="onSuccess" ref="modify-config"></modify-config>
    </el-dialog>

    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false" :title="`${stategyName}策略运行记录`" :visible.sync="dialog.record" @open="$nextTick(()=>$refs['policy-execution-record'].refreshData())" width="1400px">
      <policy-execution-record :policyId="policyId" @close="dialog.record=false" ref="policy-execution-record"></policy-execution-record>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "vue-class-component";
import { Auth, Layout, Dependencies } from "~/core/decorator";
import DataForm from "~/components/common/data-form.vue";
import DataBox from "~/components/common/data-box.vue";
import { State, Getter } from "vuex-class";
import { PageService } from "~/utils/page.service";
import { SortService } from "~/utils/sort.service";
import ModifyConfig from "~/components/system-manage/strategy-config/modify-config.vue";
import { StrategyConfigService } from "~/services/dataimp-service/strategy-config.service";
import PolicyExecutionRecord from "~/components/system-manage/strategy-config/policy-execution-record.vue";

@Auth(18)
@Layout("workspace")
@Component({
  components: {
    ModifyConfig,
    PolicyExecutionRecord
  }
})
export default class StrategyConfig extends Vue {
  @Dependencies(StrategyConfigService)
  private strategyConfigService: StrategyConfigService;
  @Dependencies(PageService)
  private pageService: PageService;
  @Dependencies(SortService)
  private sortService: SortService;

  private id: string = "";
  private policyId: any = "";
  private stategyName: any = "";
  private dialogTitle = "";
  // 数据列表
  private dataSet: any[] = [];
  // 当前行数据
  private rowData: any = null;
  // 弹框控制
  private dialog: any = {
    config: false,
    record: false
  };
  private disabledData: any = false;
  private show: any = false;

  private model: any = {
    name: "",
    strategyStatus: "",
    executionFrequency: "",
  };

  private refreshData() {
    this.strategyConfigService
      .queryStrategyConfigPage(this.model, this.pageService)
      .subscribe(data => (this.dataSet = data));
  }

  private mounted() {
    this.refreshData();
  }

  private onSuccess() {
    this.$nextTick(() => (this.id = ""));
    this.refreshData();
  }
  /**
   * 删除
   */
  private deletedClick(scope) {
    this.$confirm("是否确定删除该策略?", "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning"
    }).then(() => {
      this.strategyConfigService.delete(scope.row.id).subscribe(data => {
        this.$message.success("删除成功");
        this.refreshData();
      });
    });
  }

  /**
   * 新增点击
   */
  private addClick() {
    this.id = "";
    this.dialogTitle = "新增策略";
    this.disabledData = false;
    this.show = true;
    this.dialog.config = true;
  }

  /**
   * 修改点击
   */
  private modifyClick(scope) {
    this.id = scope.row.id;
    this.dialogTitle = "修改策略";
    this.disabledData = false;
    this.show = false;
    this.dialog.config = true;
  }

  private viewConfig(scope) {
    this.id = scope.row.id;
    this.dialogTitle = "查看策略";
    this.disabledData = false;
    this.show = false;
    this.dialog.config = true;
  }

  /**
   * 删除点击
   */
  private deleteClick(scope) {
    this.$confirm(`您确定要删除该策略吗？`, "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning"
    }).then(() => {
      const deleteId = scope.row.id;
      this.strategyConfigService.delete(deleteId).subscribe(this.refreshData);
    });
  }

  /**
   * 执行记录
   */
  private executionRecordClick(scope) {
    this.stategyName = scope.row.name;
    this.policyId = scope.row.id;
    this.dialog.record = true;
  }
}
</script>

<style lang="less">
</style>
